import {inject, observer} from "mobx-react";
import React from "react";
import {Image, StyleSheet,} from "react-native";
import {View} from 'react-native-ui-lib';
import {commonStyles} from "../configs/commonStyle";
import BasePage from "./BasePage";
import ViewUtils from "../utils/ViewUtils";
import NavigationBar from "./common/NavigationBar";
import {IconImage} from "../utils";
import {displayName as appName} from '../../app.json';

/**
 * 空白页
 */
@inject('userStore')
@observer
export default class BlankPage extends BasePage {

    constructor(props) {
        super(props);
        this.state = {}
    };

    render() {
        const title = this.props.navigation.getParam('title', appName);
        return (
            <View useSafeArea style={commonStyles.container}>
                <NavigationBar
                    leftButton={ViewUtils.getLeftButton(() => this._onBackPress())}
                    title={title}
                    backgroundColor={'transparent'}
                />
                <View style={commonStyles.container} center>
                    <Image source={IconImage['programing']} style={{width: 150, height: 150}}/>
                </View>

            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
    },
    item: {
        backgroundColor: 'white',
        borderTopLeftRadius: 5,
        borderTopRightRadius: 5,
        paddingHorizontal: 20,
        marginTop: 10,
        paddingTop: 20,
    },
    listItem: {backgroundColor: '#F7F7F7', borderRadius: 5, paddingHorizontal: 15, paddingVertical: 6, marginRight: 15,}
});
